<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 表格标签：table，table包含tr表示一行，tr包含td表示一个单元格，th表头单元格，相比td会居中加粗-->
    <!-- border:边框，默认没有，height/width:表格大小，cellspacing:表格中单元格之间的距离，
        cellpadding:单元格中内容距离单元格左边的距离，align:表格的位置，left左、center居中、right右-->
    <table border="1" height="150" width="500" cellspacing="0" cellpadding="30" align="left">
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
            <th>地址</th>
        </tr>
        <tr>
            <td>张三</td>
            <td>男</td>
            <td>20</td>
            <td>北京市</td>
        </tr>
        <tr>
            <td>李四</td>
            <td>男</td>
            <td>28</td>
            <td>广州市</td>
        </tr>
        <tr>
            <td>小红</td>
            <td>女</td>
            <td>22</td>
            <td>四川市</td>
        </tr>
    </table>

    <!-- 合并单元格，属性:rowspan跨行合并，colspan跨列合并-->
    <table border="1" height="150" width="500" cellspacing="0" cellpadding="30" align="left">
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
            <th>地址</th>
        </tr>
        <tr>
            <td>张三</td>
            <td rowspan="2">男</td>
            <td>20</td>
            <td>北京市</td>
        </tr>
        <tr>
            <td>李四</td>
            <!-- <td>男</td> -->
            <td>28</td>
            <td>广州市</td>
        </tr>
        <tr>
            <td>小红</td>
            <td colspan="2">女/22</td>
            <!-- <td>22</td> -->
            <td>四川市</td>
        </tr>
    </table>
</body>
</html>